<!-- @license MIT -->

<!-- This generates a digital clock -->

<span class="digital-clock borderDiv" data-is12hour="false">
    00:00:00  AM
</span>




<div style="max-width: 50px; max-height: 50px; overflow: hidden;">
    <style>
        .digital-clock {
            font-family: Arial, Helvetica, sans-serif;
            font-size: 30px;
            padding: 8px;
            background-color: #F1F1F160;
        }
    </style>
    
    <script>
        var updateClocksProto = function() {
            var clocks = document.getElementsByClassName("digital-clock");
            
            for (var i of clocks) {
                var date = new Date();
                var hour = date.getHours();
                var minute = date.getMinutes();
                var second = date.getSeconds();
                var am_pm = "";

                if (i.getAttribute("data-is12hour") == "true") {
                    am_pm = hour > 11 ? " PM" : " AM";
                    hour = hour > 11 ? hour - 12 : hour;
                }

                hour = hour > 9 ? hour : "0" + hour;
                minute = minute > 9 ? minute : "0" + minute;
                second = second > 9 ? second : "0" + second;

                i.innerHTML = hour + ":" + minute + ":" + second + am_pm;
            }
        }
        
        if (typeof updateClocks != "function") {
            updateClocks = updateClocksProto;
            window.setInterval(updateClocks, 500);
        }
    </script>
</div>